<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>产品详情</title>
    <link rel="stylesheet" href="/static/assets/icomoon/style.css">
    <link rel="stylesheet" href="/static/css/1reset.css">
    <link rel="stylesheet" href="/static/css/2index.css">
    <link rel="stylesheet" href="/static/css/5product.css">
</head>
<body>
    <div class="hxtop"></div>
    <main class="page-sku">
        <div class="container">
            <div class="anim">
                <span class="name"></span>
                <ul class="ulist">
                    <li><a href="javascript:;">概述</a></li>
                    <li><a href="javascript:;">性能</a></li>
                    <li><a href="javascript:;">相机</a></li>
                    <li><a href="javascript:;">参数</a></li>
                </ul>
            </div>
        </div>
        <section class="row">
            <div class="container">
            <div class="preview">
                <img src="" alt="">
                <span></span>
            </div>
            <div class="big-preview">
                <img src="" alt="">
            </div>
            <div class="property">
                <div class="pro-hd">
                    <h1 goodsId=""></h1>
                    <p></p>
                </div>
                <div class="pro-sell">
                    <span class="mod-price"></span>
                </div>
                <div class="pro-service">
                    <dl class="metatit">
                        <dt>支&nbsp;&nbsp;&nbsp;持</dt>
                        <dd><span>√花呗分期</span><span>√顺丰发货</span><span>√七天无理由退货（激活后不支持）</span></dd>
                    </dl>
                    <dl class="deliever">
                        <dt>配送服务</dt>
                        <dd>上海 宝山区 </dd>
                    </dl>
                    <div class="pro-provider">
                本商品由 魅族 负责发货并提供售后服务
                    </div>
                </div>
                <div class="pro-set">
                    <dl>
                        <dt>版&nbsp;&nbsp;&nbsp;本</dt>
                        <dd><a href="javascrtip:;" style="border-color: #00c3f5;">魅族1</a><a href="javascrtip:;">魅族2</a><a href="javascrtip:;">魅族3</a><a href="javascrtip:;">魅族4</a><a href="javascrtip:;">魅族5</a><a href="javascrtip:;">魅族6</a></dd>
                    </dl>
                    <dl>
                        <dt>网络类型</dt>
                        <dd><a href="javascript:;" style="border-color: #00c3f5;">全网公开版</a></dd>
                    </dl>
                    <dl>
                        <dt>颜色分类</dt>
                        <dd><a href="javascript:;" style="border-color: #00c3f5;">颜色1</a><a href="javascript:;">颜色2</a><a href="javascript:;">颜色3</a><a href="javascript:;">颜色4</a></dd>
                    </dl>
                    <dl>
                        <dt>内存容量</dt>
                        <dd><a href="javascript:;" style="border-color: #00c3f5;">容量1</a><a href="javascript:;">容量2</a><a href="javascript:;">容量3</a></dd>
                    </dl>
                    <dl>
                        <dt>选择套餐</dt>
                        <dd><a href="javascript:;" style="border-color: #00c3f5;">官方标配</a><a href="javascript:;">豪华套餐</a></dd>
                    </dl>
                    <dl>
                        <dt>花呗分期</dt>
                        <dd><a href="javascript:;">¥920.35×3期</a><a href="javascript:;">¥470.07×6期</a><a href="javascript:;">¥241.77×12期</a></dd>
                    </dl>
                    <dl>
                        <dt>数&nbsp;&nbsp;&nbsp;量</dt>
                        <dd><a href="javascript:;">1</a></dd>
                    </dl>
                </div>
                <div class="pro-buy">
                    <a href="javascript:;">立即购买</a>
                    <a href="javascript:;" class="btn-buy">加入购物车</a>
                </div>
            </div>
            <div class="information">
                <span>×</span>
                <p>商品已成功加入购物车</p>
                <a href="car.html">前往购物车结算></a>
            </div>
        </section>
    </div>
    </main>
    <div class="hxbottom"></div>
</body>
<script src="/static/assets/jquery.js"></script>
<script src="/static/assets/jquery.cookie.js"></script>
<script src="/static/js/product.js"></script>
<script src="/static/assets/nav2.js"></script>
<script>
     
     $(".hxtop").load("reset.html .t",function(){
        var user=$(".header-user");
        var user_list = user.find(".NoLogin");
        user.hover(function(){
            user_list.stop().slideDown()
        },function(){
            user_list.stop().slideUp()
        })
        // 如果购物车中有商品，将数字改变
    if($.cookie("NUM")){
        $(".header-cart em").html($.cookie("NUM"))
    }
        // 判断登录状态
    if($.cookie("isLogin")){
        $(".header-user").removeClass("icon-user");
        var img = $('<img src="" alt="">');
        img.attr("src","assets/images/user.jpg");
        $(".header-user").prepend(img)
        
        var user=$(".header-user");
        var user_list = user.find(".YesLogin");
        user.hover(function(){
            user_list.stop().slideDown()
        },function(){
            user_list.stop().slideUp()
        })
        $(".out").click(function(){
            $.cookie("isLogin",null)
            window.location.href="../login.html" 
        })
    }
    })
    $(".hxbottom").load("reset.html .b",function(){
           // 底部小图标显示
    var language = $(".language");
    var language_ul = $(".language").find("ul");
    var subsrcibe_a1 = $(".subsrcibe").children("a").eq(0);
    var subsrcibe_a2 = $(".subsrcibe").children("a").eq(1);
    var subsrcibe_img1 = subsrcibe_a1.find("img");
    var subsrcibe_img2 = subsrcibe_a2.find("img");

    language.hover(function(){
        language_ul.stop().show()
    },function(){
        language_ul.stop().hide()
    })
    language_ul.hover(function(){
        language_ul.stop().show()
    },function(){
        language_ul.stop().hide()
    })
    
    subsrcibe_a1.hover(function(){
        subsrcibe_img1.stop().show()
    },function(){
        subsrcibe_img1.stop().hide()
    })
    subsrcibe_img1.hover(function(){
        subsrcibe_img1.stop().show()
    },function(){
        subsrcibe_img1.stop().hide()
    })
    subsrcibe_a2.hover(function(){
        subsrcibe_img2.stop().show()
    },function(){
        subsrcibe_img2.stop().hide()
    })
    subsrcibe_img2.hover(function(){
        subsrcibe_img2.stop().show()
    },function(){
        subsrcibe_img2.stop().hide()
    })
   
    })
    
</script>
</html>